<template>
    <div class="header-bar">
        <a class="logo" :href="url">
            <img src="../assets/logo.png" alt="logo"/>
        </a>
        <a :href="url" class="back">返回首页</a>
    </div>
</template>
<script>
export default {
    name: 'HeaderBar',
    data() {
        return {
            url: 'https://www.tuandai.com'
        }
    }
}
</script>

<style lang="scss" scoped>
    .header-bar {
        width: 1200px;
        height: 100px;
        margin: 0 auto;
        position: relative;
        .logo {
            display: inline-block;
            height: 100%;
            line-height: 100px;
            
            img {
                width: 332px;
                height: 57px;
            }
        }
        .back {
            position: absolute;
            right: 0;
            top: 35px;
            font-size: 16px;
            padding: 4px 12px;
            border: 1px solid #ebdbc7;
            color:#b67d3b;
            border-radius: 5px;
            text-align: center;
            &:hover {
                border:1px solid #ff9000;
                color: #ff9000;
            }
        }
    }
</style>
